<template>
  <renderer
    ref="renderer"
    :models="models"
    :location="location"
    :cameraState="cameraState"
    :historyLocations="historyLocations"
    @on-click="mouseLeftClick"
  >
    <template v-if="models.walkModel && Object.keys(models.walkModel).length !== 0">
      <person
        v-for="tag in position"
        :key="tag.code"
        :code="tag.code"
        :name="tag.name || tag.code+''"
        :avatar="tag.avatar || null"
        :posId="tag.posId"
        :location="tag.pathPosition || tag.smoothedPosition"
        :models="models"
        :type="tag.type"
        :historyLocations="historyLocations"
      ></person>
    </template>
  </renderer>
</template>

<script>
import Renderer from "./Renderer.vue";
import Person from "./Person.vue";
import MouseEvents from "./MouseEvents.vue";

export default {
  name: "web3d",
  mixins: [MouseEvents],
  components: {
    Renderer,
    Person
  },
  props: {
    models: { type: Object },
    location: { type: Array, default: () => [1, 1, 1] },
    scale: { type: Array, default: () => [1, 1, 1] },
    position: { type: Array },
    cameraState: { type: Object },
    historyLocations: { type: Array, default: _ => [] }
  },
  data() {
    return {};
  },
  computed: {},
  mounted() {},
  methods: {},
  beforeDestroy() {}
};
</script>